import QtQuick

Rectangle {

    id:navItemRoot
    property int lineHeight: 18
    //字体大小
    property int wordWidth: 12
    //调节后缀长度
    property int suffWordWidth:10
    property int defaultMinSpaceLength: 10
    property int defaultSpaceLength: 40
    property string backColor:"#58e67e"
    property string selectedColor:"white"
    //误差调整量
    property int diffWidth : 0

    property var dataObj: [{
            "title": "打开文件",
            "suffix": "ctl+a",
            "iconUrl": "",
        }, {
            "title": "打开历史文件",
            "suffix": "ctl+h",
            "iconUrl": "",
        }, {
            "title": "关闭所有文件并清空历史记录",
            "suffix": "ctl+e",
            "iconUrl": "",
        }]


    property int totalHeight: dataObj.length * lineHeight
    property int maxTitleWidth: calcMaxTitleWidth()
     property int lineWidth: calcLineWidth(dataObj)-diffWidth

    width: lineWidth
    height: totalHeight



    function calcLineWidth(dataObj) {
        var res = 0
        for (var i = 0; i < dataObj.length; i++) {

            var iconlength = lineHeight - 5
            var titleLength = dataObj[i].title.length * wordWidth
            var suffixLength = dataObj[i].suffix.length * suffWordWidth
            var strLength = titleLength + suffixLength
            res = Math.max(res, 2*defaultMinSpaceLength + iconlength + strLength+defaultSpaceLength)
        }
        //console.log(res);
        return res
    }

    function calcTitleWidth(dataObj,n){
        return dataObj[n].title.length * wordWidth
    }

    function calcSuffixWidth(dataObj,n){
        return dataObj[n].suffix.length * suffWordWidth
    }

    function calcIconWidth(){
        return lineHeight - 5
    }

    function calcSpaceWidth(k){
        var iconlength = calcIconWidth()
        var titleLength = dataObj[k].title.length * wordWidth
        var suffixLength = dataObj[k].suffix.length * suffWordWidth
        var strLength = titleLength + suffixLength
        var res= lineWidth-(2*defaultMinSpaceLength + iconlength + strLength)
        console.log(k+"_space:"+res+";total:"+((2*defaultMinSpaceLength + iconlength + strLength))+";;"+lineWidth);
        return res;
    }

    function calcMaxTitleWidth(){
        var res = 0
        for (var i = 0; i < dataObj.length; i++) {
            var titleLength = dataObj[i].title.length * wordWidth
            res=Math.max(res,titleLength)
        }
        return res
    }

    Repeater{
        model:dataObj
        Rectangle{

            height: lineHeight
            width : lineWidth
            color: backColor
            anchors.top: parent.top
            anchors.left: parent.left
            anchors.topMargin: lineHeight*index

            Image {
                id: icon
                width: calcIconWidth()
                height: calcIconWidth()
                source: modelData.iconUrl
                clip: true
                anchors.top: parent.top
                anchors.left: parent.left
                anchors.leftMargin: 0
                anchors.topMargin: 3
                onStatusChanged: {
                    if (status === Image.Error) {
                        console.log("图片加载失败，状态: Image.Error")
                    } else if (status === Image.Ready) {
                        console.log("Image loaded successfully:", source)
                    }
                }
            }


            Text {
                width:  calcTitleWidth(dataObj,index)
                height: lineHeight
                text: modelData.title
                font.pixelSize: wordWidth
                anchors.top: parent.top
                anchors.topMargin: 1.5
                anchors.left: parent.left
                anchors.leftMargin: calcIconWidth()+ defaultMinSpaceLength
                //anchors.centerIn: parent.Center
            }

            Text {
                width: calcSuffixWidth(dataObj,index)
                height: lineHeight
                text: modelData.suffix
                font.pixelSize: wordWidth
                anchors.top: parent.top
                anchors.topMargin: 1.5
                anchors.left: parent.left
                anchors.leftMargin: calcSpaceWidth(index)+calcIconWidth()+ defaultMinSpaceLength+calcTitleWidth(dataObj,index)
            }

            MouseArea{
                anchors.fill: parent
                hoverEnabled: true
                onEntered: {
                    color=selectedColor
                }
                onExited: {
                    color=backColor
                }

            }


        }


    }

}
